
Vue.component('smart-img', {
    inheritAttrs: false,
    modeMap: {
        'contain': 'contain-img',
        'cover': 'cover-img',
        'original': 'scroll-img',
        'follw-width': 'follow-width-img',
        'follw-height': 'follow-height-img',
        'self': 'self-wh-img',
        'unknown': 'contain-img'
    },
    props: {
        mode: {
            type: String,
            default: 'unknown'
        }
    },
    computed: {
        imgComponent: function() {
            var modeMap = this.$options.modeMap;
            if (this.mode in modeMap) {
                return modeMap[this.mode];
            } else {
                return modeMap['unknown'];
            }
        }
    },
    created: function() {
        console.log(this)
    },
    template: `
        <keep-alive>
            <component v-bind="$attrs" :is="imgComponent" :key="mode" v-on="$listeners"></component>
        </keep-alive>
    `    
})